<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	<title>FDM Library Portal</title>
	<link href="/LibraryWebApplication/resources/css/mycss.css" rel="stylesheet" type="text/css" />
	<link href="/LibraryWebApplication/resources/css/jquery-ui-1.9.2.custom.css" rel="stylesheet" type="text/css" />
	<link href="/LibraryWebApplication/resources/css/bootstrap.css" rel="stylesheet" media="screen" type="text/css"/>
	<script type="text/javascript" src="/LibraryWebApplication/resources/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="/LibraryWebApplication/resources/js/jquery-1.8.3.js"></script>
	<script type="text/javascript" src="/LibraryWebApplication/resources/js/jquery.validate.js"></script>
	<script type="text/javascript" src="/LibraryWebApplication/resources/js/jquery-ui-1.9.2.custom.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			
			$("#divAddNewBook").hide();
			
			$("#addBook").click(function(){
				$("#divAddNewBook").show();
			});
			$('button#registerbook').click(function(){
				var a=confirm("Confirm book entry?");
				var title=$('input#title').val();
				var author=$('input#author').val();
				var isbn=$('input#isbn').val();
				var bookCount=$('#bookCount').val();
				if(a==true){
					$.ajax({
								url:'addBookToInventory.do',
								cache:false,
								type:"POST",
								success:function(text){
									/*$('#info').html(text);*/
									alert(text);
								},
								data:{title:title, author:author, isbn:isbn, bookCount:bookCount},
								dataType:"html",
								async:true
							});
				}
			});
		});
	</script>
</head>
<body>
	<div id="container">
		<div id="header">
			FDM Library Web Portal
		</div>
		<div id="content">
			<div id="menu">
				<a href="inventory.do">Update Library Inventory</a>
					
				<br/>
				<a href="">Suspend user(s)</a>
				<br/>
				<a href="">View Defaulting Users</a>
				<br/>
				<a href=""></a>
			</div>
			<div id="subcontent">
				<div id="role_header">
					Administrator Page
				</div>
				
				<button id="addBook">Add New Book</button>
				
				<button id="removeBook">Remove Book</button>
				
				<button id="updateBook" onclick="">Update Book Entry</button>
								
				<div id="divAddNewBook">
					<form id="formAddBook" method="post" action="addBookToInventory.do">
						<!-- class="input-block-level" -->
						<label for="title">Title: </label><input type="text" id="title" name="title" placeholder="Book Title"/><br/>
						<label for="author">Author: </label><input type="text" id="author" name="author"  placeholder="Book Author"/><br/>
						<label for="isbn">ISBN: </label><input type="text" id="isbn" name="isbn"  placeholder="ISBN number"/><br/>
						<label for="bookCount">Number of Copies: </label>
						<select name="bookCount" id="bookCount">
							<option value="1">1</option>
							<option value="2">2</option>
							<option value="3">3</option>
							<option value="4">4</option>
							<option value="5">5</option>
							<option value="6">6</option>
						</select>
						
						<br/>
						<button class="btn btn-small btn-primary" id="registerbook" type="button">Register book</button>
						<br/>
						<div id="info" style="color: green;"></div>
					</form>
				</div>
			</div>
		</div>
	</div>
</body>
</html>